<!--# include virtual="/lib/common-head.html"  wait="yes" -->
  <title> my vue 2 </title>
  <style>
    html,body{
      height: 100%;
    }
    .bg-df{
      background-color: #23262e;
    }
    .color-df{
      color:  rgba(255,255,255,0.7);
    }
    a.switch-menu-wrap{
      padding: 0 20px 0 0;
      height: 100%;
      font-size: 20px;
      line-height: 250%;
      color: white;
    }
    .layui-logo2{
      height: 48px;
      line-height: 48px;
      font-size: 16px;
    }

    .layui-nav{
      background-color: #23262e !important;
    }
    .layui-nav-tree .layui-nav-more{
      right: 35px !important;
    }

    .main>.layui-tab-title {
      border-bottom: solid 2px #222d32;
      height: 30px
    }
    .main>.layui-tab-title li {
      line-height: 250% !important;
      height: 100%;
      font-size: 12px !important;
      padding: 0 0 0 16px !important
    }
    .main>.layui-tab-title .layui-this {
      color: #fff;
      background-color: #000
    }
    .main>.layui-tab-title .layui-this:after {
      border: none
    }
    .main>.layui-tab-title i {
      margin-right: 10px
    }
    .layui-layout-admin>div>.layui-nav-tree i {
      margin-right: 10px;
    }
    .layui-layout-admin>div>.layui-nav-tree .layui-nav-child a {
      font-size: 12px;
      height: 30px;
      line-height: 30px
    }
    .layui-layout-admin>div>.layui-nav-tree .layui-nav-child.layui-this a {
      font-size: 14px !important
    }
    /* .layui-tab-content {
      background: url('__IMG__/bg.png') center center no-repeat;
    } */
    .theme-wrap,.lang-wrap{ }
    .theme-wrap>div{ display: inline-block;width: 50px;height: 40px;cursor: pointer;margin: 1px 2px 1px; }
    .lang-wrap>div{
      cursor: pointer;margin: 1px 2px 1px;
    }
    .theme-wrap>.theme{ border-color: transparent !important;border-radius: 5px;transition: all .5; }
    .lang-wrap>.lang{
      border: 2px #8abbe69c solid;border-radius: 5px;transition: all .5;
    }
  </style>
  <!--# include virtual="/lib/common-lib.html" wait="yes" -->
  <link rel="stylesheet" href="./static/css/flex.css">
</head>
<body>
<div class="flex flex-y-100 flex-x-left layui-layout layui-layout-admin width-f scroll-hide"
 style="min-height:100%;">
  <!-- 左侧导航区域 -->
  <div class="flex-item js-side-menu" style="width:180px;">
    <!-- logo -->
    <div class="flex-item bg-df color-df layui-logo2 hvr-pop js-tab text-center pointer width-f"
     data-href="welcome" data-tab="0" title="欢迎页"> RainbowPhp </div>
    <!-- left-menu -->
    <ul class="layui-nav layui-nav-tree js-left-menu height-f flex-item scroll-y"
     lay-filter="side-menu" lay-shrink="">
    </ul>
  </div>
  <div class="flex-item flex-item-1 flex flex-arr-y z-1" style="">
    <div class="flex-item flex bg-df color-df" style="height:48px;">
      <a href="javascript:;" class="flex-item js-hide-menu switch-menu-wrap" title="转换侧边栏"><i class="fa fa-bars"></i></a>
      <ul class="flex-item layui-nav layui-nav-mini js-top-menu">
      </ul>
      <div class="flex-item-1 js-hide-menu" style="height: 100%;width: 550px;"></div>
      <ul class="flex-item layui-nav header-mid p0">
        <li class="layui-nav-item">
          <a data-href="user/detail" class="js-my js-tab pointer" data-title="用户详情">
            <img src="<!--# echo var='ava_url' -->?uid=1&size=60&fresh=1" class="layui-nav-img">
          <span class="layui-nav-more"></span></a>
          <dl class="layui-nav-child">
            <dd><a data-href="user/detail" class="js-my pointer js-tab">基本资料</a></dd>
            <dd><a href="javascript:void(0);" class="js-set-theme" data-theme="cyan">风格设置</a></dd>
            <hr>
            <dd><a href="javascript:void(0);" class="js-tab" data-tab="users-1">系统设置</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item hvr-push">
          <a href="javascript:;" class="js-todo" style="font-size: 0">
            <i class="layui-icon layui-icon-notice"></i>
            <i class="layui-badge" style="border-radius: 50%;margin: -11px 0px 0;">5</i>
            <!-- <span class="layui-badge-dot"></span> -->
          </a>
        </li>
      </ul>
      <ul class="flex-item layui-nav header-right">
        <li class="layui-nav-item">
          <!-- <a href='<!- -# echo var="api_url" - ->manager/logout.html' class="ajax-get pl10 pr10 layer-msg js-logout" title="退出"> <i class="fa fa-sign-out"></i></a> -->
          <a href='javascript:;' class=" js-todo ajax-get pl10 pr10 layer-msg js-logout" title="退出"> <i class="fa fa-sign-out"></i></a>
        </li>
        <li class="layui-nav-item"><a href="javascript:;" class="pl0 pr10 js-refresh" title="刷新"> <i class="layui-icon layui-icon-refresh"></i></a></li>
        <li class="layui-nav-item">
          <a href="javascript:;" class="pl0 pr10" id="admin-fullscreen" title="全屏"><i class="layui-icon layui-icon-screen-full"></i> <span class="admin-fullText"></span> </a>
        </li>
      </ul>
    </div>
    <!-- 内容主体 -->
    <div class="flex-item bg-white flex-item-1 main layui-tab flex flex-arr-y" lay-filter="mainTab" lay-allowClose="true" id="mainTab" >
      <ul class="flex-item layui-tab-title" style=""></ul>
      <div class="flex-item-1 layui-tab-content p0" style=""></div>
    </div>
    <!--# include virtual="/lib/admin-footer2.html" -->
  </div>
</div>
<script src="./static/js/index2.js"></script>
</body>
</html>